<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport"
			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>生产领料库存检索</title>
		<link href="../../../css/mui.min.css" rel="stylesheet" />
		<link href="../../../css/AcmeMes.css" rel="stylesheet" />
		<link href="../../../css/layer.css" rel="stylesheet" />
		<script src="../../../js/lib/jquery-2.1.1.min.js"></script>
		<script src="../../../js/lib/mui.min.js"></script>
		<script src="../../../js/config.js"></script>
		<script src="../../../js/lib/base64.min.js"></script>
		<script src="../../js/WMS/WmsProductionPickingOrderList_3.js"></script>
		<script type="text/javascript">
		</script>
		<style>
			.mui-title {
				font-weight: bold;
				color: aliceblue;
			}

			.mui-bar-transparent {
				background-color: rgba(47, 64, 86, .99);
			}
		</style>
	</head>
	<body>

		<input type="hidden" id="hFromWarehouseID">
		<input type="hidden" id="hBatchNO">
		<input type="hidden" id="hStrongNO">
		<input type="hidden" id="hTradeSouceID">
		<!-- <header class="mui-bar mui-bar-nav mui-bar-transparent">
			<h2 class="mui-title">Material requisition inventory</h2>
		</header> -->
		<div class="mui-navbar-inner mui-bar mui-bar-nav mui-bar-transparent">
			<button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
				<span class="mui-icon mui-icon-left-nav"></span>
			</button>
			<h1 class="mui-center mui-title">Material requisition inventory</h1>
		</div>
		<footer class="mui-bar mui-bar-footer">
			<a href="#bottomPopover" class="mui-btn mui-btn-link mui-pull-right">Scanned List</a>
		</footer>
		<div class="mui-content">
			<form class="mui-input-group" style="background-color: transparent;">
				<div class="mui-input-row">

					<label style="font-weight: bold;">OrderNO:</label>
					<input type="text" style="width: 60%" readonly="readonly" id="TradeOrderNO">
				</div>
				<div class="mui-input-row">
					<label style="font-weight: bold;">MaterNO:</label>
					<input type="text" style="width: 60%" readonly="readonly" id="MaterialCode">
				</div>
				<div class="mui-input-row" style="display: flex; align-items: center;">
					<label style="font-weight: bold;"
						oninput="this.value = this.value.replace(/[^0-9]/g, '');">Qty:</label>
					<input type="text" id="Qty" readonly="readonly">
					<button type="button" data-loading-icon-position="right" class="mui-btn-primary"
						style="width: 100px;" onclick="GetCalculateInfo()">Query</button>
				</div>
				<div class="mui-input-row" style="display: flex; align-items: center;">
					<label style="font-weight: bold;">Color:</label>
					<select id="shelfOption">
						<option value="1"> Red </option>
						<option value="2">Green </option>
						<option value="3">Blue </option>
						<option value="4">Yellow </option>
						<option value="5">Magenta </option>
						<option value="6">Cyan </option>
						<option value="7">White </option>
					</select>
					<button type="button" data-loading-icon-position="right" class="mui-btn-success"
						style="margin-left: 15px; width: 106px;text-align: center;" onclick="LigthUP()">Light</button>
				</div>
				<div class="mui-input-row">

					<label style="font-weight: bold;">CodeOFF:</label>
					<input type="text" placeholder="Please scan the BarCode" id="BarCode" inputmode="none"
						class="mui-input-clear">
				</div>
				<div class="mui-input-group">
					<div style="display: flex; justify-content: space-between;">
						<button type="button" data-loading-icon-position="right" class="mui-btn-warning"
							style="height: 40px;" onclick="LigthOff()">LampOFF</button>
						<button type="button" data-loading-icon-position="right" class="mui-btn-danger"
							onclick="AllDown()">All
							down</button>
					</div>

				</div>
			</form>

			<div class="job-box">
				<ul class="mui-table-view" id="all">

				</ul>
			</div>

			<!--右下角弹出菜单-->
			<div id="bottomPopover" class="mui-popover mui-popover-bottom">
				<div class="mui-popover-arrow"></div>
				<div class="mui-scroll-wrapper">
					<div class="mui-scroll">
						<ul class="mui-table-view" id="scannedBarcodesList">
						</ul>
					</div>
				</div>

			</div>

		</div>
	</body>
	<style>
		.selection-dialog {
			position: fixed;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			background-color: white;
			padding: 20px;
			box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
			z-index: 1000;
		}

		.selection-dialog button {
			margin: 5px;
		}

		.title {
			position: relative;
			margin: 10px 15px 7px;
			color: #6d6d72;
			font-size: 15px;
		}

		.title button {
			position: absolute;
			right: -13px;
			/* 与父容器的 margin 一致 */
			top: 50%;
			transform: translateY(-50%);
		}

		select {
			width: 215px;
			background-color: #ddd;
			margin-top: 2px;
			font-size: 15px;
			margin-left: 15px;
			margin-bottom: 2px;
			text-align: center;
		}

		option {
			width: 100%;
			text-align: center;
		}

		/* 统一表单行样式 */
		.mui-input-row {
			display: flex;
			align-items: center;
			margin-bottom: 10px;
		}

		/* 统一label样式 */
		.mui-input-row label {
			width: 100px;
			font-weight: bold;
			flex-shrink: 0;
		}

		/* 输入框和选择框样式 */
		.mui-input-row input,
		.mui-input-row select {
			flex-grow: 1;
			margin-left: 10px;
			padding: 8px;
			border: 1px solid #ddd;
			border-radius: 4px;
		}

		.mui-popover {
			height: 300px;
		}

		.mui-content {
			padding: 10px;
		}
	</style>
</html>